import('lib-flexible/flexible')
import Vue from 'vue';
import framework, {WebBridge} from './framework';

import Vant, {Lazyload} from 'vant';
import 'vant/lib/index.css';
// 头部签名
import HeaderFactory from './header/headers'

Vue.use(Vant);
Vue.use(Lazyload);

Vue.config.errorHandler = function (err = "", vm, info) {
    console.error(err, info)
};

import xkaImage from '../components/common/image'
import xkaIcon from '../components/common/icon'
import ScrollReveal from 'scrollreveal'

Vue.component('xka-image', xkaImage)
Vue.component('xka-icon', xkaIcon)

Vue.mixin({
    mounted() {     // 自动根据html的标题，设置页面标题
        if (this.$options.head?.title) {
            WebBridge.setTitle(this.$options.head.title)
            if (this.$parent?.$parent) {
                this.$parent.$parent.title = this.$options.head.title
            }
        }

        // 监听 滚动动效
        window.addEventListener("scroll", this.scrollArea());
    },
    methods: {
        scrollArea() {
            ScrollReveal().reveal(".v-content", {
                reset: false,    
                // 元素离开视口后返回初始位置, 等待下一次触发, 值为false时动画值触发一次
                origin: 'bottom',     
                // 指定元素在显示时的方向, 需要给options指定非零值才能对origin动画产生明显影响。
                // 接受的参数 'top' 'right' 'bottom' 'left' 
                delay: 200,    
                // 动画开始前的延迟时间, 触发的动画 reset 永远不会使用延迟。
                distance: '100px',   
                // 控制元素在显示时移动多远。接受的单位 px|em|%
                duration: 700,   
                // 控制动画持续时间, 单位为 ms
                easing: 'ease',
                // interval: 300,    
                //  ‘ease’ ‘ease-out’‘ease-in-out’‘ease-in-out’ 
                // 控制动画如何在起始值和结束值之间转换
                // opacity: 0    
                // 指定在显示之前它们具有的不透明度。        
                //rotate: { x: 0, y: 0, z: 0 }     
                // number单位为角度
                //scale: 0.8      
                // 指定在显示之前元素的大小。
                //mobile: true,
                // 滚动的距离，单位可以用%，rem等
            });
        }
    }
})

export default ({
                    store,
                    route,
                    redirect
                }) => {
    Vue.use(framework, {
        store,
        hooks: {
            resolveHttpSuccess: (res, options) => {
                if (res.data.code) {
                    return Promise.reject(res.data)
                }
                return options.returnAll ? res.data : res.data.data;
            },
            catchHttpError: err => {
                return Promise.reject(err);
            },
            beforeHttp: options => {
                let headersMap = HeaderFactory.getHeaders() || {};
                let userInfo = WebBridge.getUserInfo()
                options.headers = {
                    ...headersMap,
                    ...(options.headers || {}),
                    "X-CLIENT-TICKET": userInfo ? userInfo.token || '' : ''
                }
                return options;
            },
            showLoading: text => {
                window._loading = Vue.prototype.$toast.loading({
                    message: text,
                    forbidClick: true,
                });
            },
            hideLoading: () => {
                window._loading && window._loading.close();
            },
            toastError: text => {
                Vue.prototype.$toast(text);
            }
        }
    });
}
